* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html,body {
    width: 100%;
    height: 100%;
}
.content {
    width: 100%;
    height: 100%;
    padding: 3% 10%;
    background-image: url('../image/video.jpg');
}
.videobox {
    border: 1px solid #fff;
    background-image: url(https://cdn.jsdelivr.net/gh/Zrahh/JsDelivr_CDN/assets/img/loading.gif);
    background-size: 80px;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #000;
}
#palybox {
    width: 100%;
    height: 100%;
}
.inputbox {
    background-color: #fff; 
    padding: 15px;
}
.inputbox .url-text {
    height: 40px;
    background: #f2f3f5;
    border: 1px solid #f2f3f5;
}
/* 输入框 */
.inputbox .input{
    text-indent: 1em;
    width: 100%;
}
/* 筛选框 */
.inputbox .select{
    width: 100%;
    color: #4078eb;
}
/* 按钮 */
.inputbox .btn{
    width: 100%;
    color: #fff;
    background: linear-gradient(to right, #56c0f9 , #3b95f7);
    cursor: pointer;
}
.inputbox .btn:hover {
    background: linear-gradient(to right, #ffb199, #fa709a);
}
/* 底部 */
.tit-gg {
    padding: 15px;
    background-color: #fff;
    color: #999;
    font-size: 14px;
}
.resetP {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

@media (min-width: 1201px) {
    .videobox{
        height: 500px;
    }
}
@media (max-width: 1200px) and (min-width: 993px) {
    .videobox{
        height: 400px;
    }
}
@media (max-width: 992px) and (min-width: 769px) {
    .videobox{
        height: 300px;
    }
}
@media (max-width: 768px) and (min-width: 0px) {
    .videobox{
        height: 200px;
    }
}

